<template>
    <div class="froms" v-loading="listLoading">
          <el-dialog  :title="title"  :visible.sync="Visible" width="30%" :before-close="handleClose">

            <el-form :model="deptData"  style="width:80%" ref="deptData" :rules="rules">
                
                <el-form-item  v-if="index==0" v-for="(item,index) in DeptTree"  label="上级部门" :label-width="labelwidth">  
                    <div >
                  {{DeptTree[index].deptid}}    {{DeptTree[index].deptname}}  
                    </div>                           
                </el-input>
                </el-form-item> 

                <el-form-item  label="部门ID" :label-width="labelwidth" prop="deptid">
                    <el-input  v-model="deptData.deptid">
                    </el-input>
                </el-form-item> 

                <el-form-item label="部门名称" :label-width="labelwidth" prop="deptname">
                    <el-input v-model="deptData.deptname">
                    </el-input>
                </el-form-item>

                <el-form-item label="部门编码" :label-width="labelwidth" prop="deptcode">
                    <el-input v-model="deptData.deptcode">
                    </el-input>
                </el-form-item>
            </el-form> 
             <div slot="footer" class="dialog-footer">
                <el-button @click="resetForm('deptData')">取 消</el-button>
                <el-button type="primary" @click="AddDept('deptData')">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>


<script>

 
export default{
  
    props:{
        DeptTree:{
            type:Array
        }
    },
    data(){
        return {
            id:-1,
            title:'部门添加',
            Visible:false,
            labelwidth:'80px',
            deptData:{},
            listLoading:false,
            tree2:{},
            rules:{
                deptid:[
                    {required:true,message:'请输入部门ID',trigger:'change'}
                ],
                deptname:[
                    {required:true,message:'请输入部门名称',trigger:'change'}
                ],
                deptcode:[
                    {required:true,message:'请输入部门编码',trigger:'change'}
                ]
            }
        }
    },
    mounted(){
      
     
    },
    methods:{
         //角色添加
         AddDept(deptData){

            var _this = this;
            _this.deptData.parentid  = this.DeptTree[0].deptid;
            _this.$refs[deptData].validate((valid)=>{             
            if(valid){               
                // 开启动画
                _this.listLoading = true;
                _this.$api.DeptAdd(_this.deptData).then((res)=>{
                //关闭动画
                _this.listLoading = false;                      
                // 数据返回成功
                if(res.result=='ok'){                     
                    _this.$message({message:res.msg,type:'success'})
                    _this.Visible =false;                          
                    // 调用父组件的获取数据方法
                    _this.$parent.getResult();
                    _this.UPTree();
                    _this.resetForm();
                }
                }).catch((err)=>{
                    _this.$message({  message:err.msg,   type:'error'});
                })   
            }else{            
                console.log("失败");
            }
            });    
         },
         EditRole(){
             var data = {'roleid':this.id};
             this.$api.RolerolegetID(data)
             .then((res)=>{
                this.roleData =  res.data;
             })
             .catch((err)=>{
                this.$message({
                     message:'错误'
                 })
             });

         },
         // 取消
        resetForm(){    
           
          this.$refs.deptData.resetFields();
          this.Visible =false;
        },
        handleClose(done){
            done();
            this.resetForm();
        },
        UPTree(){

            this.$parent.gettree();

        }
    }
}
</script>

<style>

 
</style>